<template>
  <div class="app-container" ref="content">
    <div style="text-align: center;padding: 10px">《{{ alarmInfo.name }}》-详情信息</div>
    <div style="margin: 10px auto;text-align: center">
      <!--            <el-button type="primary" size="mini"  @click="publishAlarmInfo()" align="center">发布预警</el-button>-->
      <!--            <el-button type="success" icon="el-icon-plus" size="mini" class="filter-item" @click="handleAdd()">火情</el-button>-->
      <el-button type="primary" size="mini" v-if="alarmInfo.feedtype==-1" @click="show=true" align="center">
        分配人员
      </el-button>
      <div style="width: 100%" v-if="show">
        <el-form :model="executePersonForm" ref="executePersonForm" label-width="150px">
          <el-form-item label="执行人员" prop="userId">
            <el-select v-model="executePersonForm.userId" filterable placeholder="请选择执行人员" style="width: 100%">
              <el-option v-for="(item,index) in userList" :key="index" :value="item.ucId"
                         :label="item.name"></el-option>
            </el-select>
          </el-form-item>
          <div align="center">
            <el-button type="primary" @click="updateUser">确定</el-button>
          </div>
        </el-form>
      </div>
    </div>
    <el-row :gutter="10">
      <el-form :model="alarmInfo" ref="alarmInfo" label-width="150px">
        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="所属主体:" prop="enterpriseName">
              {{ alarmInfo.enterpriseName }}
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="预警名称:" prop="name">
              {{ alarmInfo.name }}
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="设备名称:" prop="equipmentName">
              {{ alarmInfo.equipmentName }}
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="巡检员名称:" prop="userName">
              {{ alarmInfo.userName }}
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="预警时间:" prop="alarmTime">
              {{ alarmInfo.alarmTime  |dateFormat }}
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="预警内容:" prop="alarmInfo">
              {{ alarmInfo.alarmInfo }}
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="企业控制室确认时间:" prop="enterpriseConfirmTime">
              {{ alarmInfo.enterpriseConfirmTime |dateFormat }}
            </el-form-item>
          </el-col>
          <div v-if="alarmInfo.userId!=null">
            <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
              <el-form-item label="巡检人员确认时间:" prop="userConfirmTime">
                {{ alarmInfo.userConfirmTime | dateFormat }}
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
              <el-form-item label="巡检人员确认时间:" prop="userConfirmTime">
                {{ alarmInfo.userConfirmTime | dateFormat }}
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
              <el-form-item label="消防确认时间:" prop="manageConfirmTime">
                {{ alarmInfo.manageConfirmTime |dateFormat }}
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
              <el-form-item label="巡检人员到达时间:" prop="userArriveTime">
                {{ alarmInfo.userArriveTime | dateFormat }}
              </el-form-item>
            </el-col>
          </div>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="建筑反馈类型:" prop="feedtype">
              {{
                alarmInfo.feedtype == 0 ? "误报"
                    : alarmInfo.feedtype == 1 ? "故障"
                    : alarmInfo.feedtype == 2 ? "火情" : "其他"
              }}
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="反馈内容:" prop="feedback">
              {{ alarmInfo.feedback }}
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="详细地址:" prop="location">
              {{ alarmInfo.location }}
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <el-form-item label="处理意见:" prop="disposalOpinions">
              {{ alarmInfo.disposalOpinions }}
            </el-form-item>
          </el-col>
        </el-col>
      </el-form>
    </el-row>
  </div>
</template>

<script>
import {getInFireAlarmInfoVo, assignPeople} from "@/api/fireAlarmInfo";
import {getInUserList} from "@/api/enterprise";

export default {
  name: "alarmInfo",
  data() {
    return {
      alarmInfo: {},
      executePersonForm: {
        userId: null
      },
      show: false,
      userList:[]
    }
  },
  filters: {},
  created() {
    this.$nextTick(() => {
      this.getInFireAlarmInfoVo(this.$route.params.ucId)
    });
  },
  methods: {
    getInUserList(val) {
      getInUserList({deleted: false, flagId: val}).then(res => {
        this.userList = res.data
      })
    },
    //分配人员
    updateUser() {
      this.executePersonForm.ucId = this.$route.params.ucId
      this.$refs['executePersonForm'].validate(valid => {
        if (valid) {
          assignPeople(this.executePersonForm).then(res => {
            this.$notify.success({
              title: '成功',
              message: "分配人员成功"
            })
            this.getInFireAlarmInfoVo(this.$route.params.ucId)
            this.show = false
          }).catch(res => {
            this.$notify.error({
              title: '失败',
              message: res.msg
            })
          })
        }
      })
    },
    getInFireAlarmInfoVo(val) {
      //获取预警信息数据
      let loadingInstance = this.$loading({
        target: this.$refs.content,
        text: '数据加载中'
      });
      getInFireAlarmInfoVo({ucId: val}).then(res => {
        console.log(res.data)
        this.alarmInfo = res.data
        this.getInUserList(res.data.enterpriseId)
        loadingInstance.close()
        this.$notify.success({
          title: '成功',
          message: "获取预警信息成功"
        })
      }).catch(error => {
        console.log(error)
        loadingInstance.close()
        this.$notify.error({
          title: '失败',
          message: "获取预警信息失败"
        })
      })
    },
    publishAlarmInfo(val) {
      this.$router.push("/fireAlarm/infoPublish?ucId=" + this.alarmInfo.ucId + "&eId=" + this.alarmInfo.enterpriseId)
    },

    handleAdd() {
      this.$router.push("/fireAlarm/fireInfoEdit?alarmInfoId=" + this.alarmInfo.ucId + "&eId=" + this.alarmInfo.equipmentId)
    },

  }

}
</script>
